import { Layout } from "antd";
import FormItemConfig from "./FormItemConfig";
import FormItemOverview from "./FormItemOverview";
import FormPage from "./FormPage";
import "./index.less";
import useFormConfig from "./useFormConfig";

const { Header, Sider, Content } = Layout;

const FormConfigPage = () => {
  const formConfig = useFormConfig()
  const { formItemsConfig, addFormItem } = formConfig

  return (
    <Layout className="common-page form-config-page">
      <Header className="page-header">
        <div className="page-title">表单编辑页面</div>
      </Header>
      <Layout>
        <FormItemOverview addFormItem={addFormItem}></FormItemOverview>
        <FormPage formConfig={formConfig} ></FormPage>
        <FormItemConfig formConfig={formConfig}></FormItemConfig>
      </Layout>
    </Layout>
  );
};

export default FormConfigPage;
